
// 地图坐标选择弹窗
<template>
    <el-dialog title="地图坐标选择" width="1024px" :visible.sync="positionVisible" custom-class="positionDialog" :close-on-click-modal="false">
        <iframe class="iframe" width="100%" height="620px" :src="positionUrl" frameborder="0"></iframe>
    </el-dialog>
</template>

<script>
export default {
    name: 'positionDialog',
    data() {
        return {
            // 弹窗控制器
            positionVisible: false,
        }
    },
    computed: {
        // 定位页面地址
        positionUrl(){
            let origin = window.location.origin.replace(/:\d{4}$/,'')
            return `${origin}:9080/poi/index.html`
            //return 'http://127.0.0.1:8848/poi/index.html'
        }
    },
    mounted() {
        window.addEventListener('message', this.handlePostMessage, false);
    },
    beforeDestroy() {
        window.removeEventListener('message', this.handlePostMessage, false);
    },
    methods: {
        show(){
            this.positionVisible = true
        },
        handlePostMessage(event){
            if(!this.positionVisible) return;
            this.$emit('changeMessage',event.data)
            this.positionVisible = false
        },
    }
}
</script>

<style lang="scss" >
.positionDialog{
    .iframe{
        display: block;
    }
}
</style>